import patchVnode from './patchVnode';
import createElement from './createElement';

function sameVnode(a, b) {
  return a.sel == b.sel && a.key == a.key;
}

export default function updateChildren(parentElm, oldCh, newCh) {
  console.log(parentElm);
  console.log(oldCh);
  console.log(newCh);
  // 旧前
  let oldStartIdx = 0;
  // 旧后
  let oldEndIdx = oldCh.length - 1;
  // 新前
  let newStartIdx = 0;
  // 新后
  let newEndIdx = newCh.length - 1;
  // 旧前节点
  let oldStartVnode = oldCh[oldStartIdx];
  // 旧后节点
  let oldEndVnode = oldCh[oldEndIdx];
  // 新前节点
  let newStartVnode = newCh[newStartIdx];
  // 新后节点
  let newEndVnode = newCh[newEndIdx];

  // 缓存keymap
  let keyMap = null;

  while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
    if (oldStartVnode == null || oldCh[oldStartIdx] == undefined) {
      oldStartVnode = oldCh[++oldStartIdx];
    } else if (oldEndVnode == null || oldCh[oldEndIdx] == undefined) {
      oldEndVnode = oldCh[--oldEndIdx];
    } else if (newStartVnode == null || newCh[newStartIdx] == undefined) {
      newStartVnode = newCh[++newStartIdx];
    } else if (newEndVnode == null || newCh[newEndIdx] == undefined) {
      newEndVnode = newCh[--newEndIdx];
    } else if (sameVnode(oldStartVnode, newStartVnode)) {
      console.log('①');
      // 新前与旧前
      patchVnode(oldStartVnode, newStartVnode);
      oldStartVnode = oldCh[++oldStartIdx];
      newStartVnode = newCh[++newStartIdx];
    } else if (sameVnode(oldEndVnode, newEndVnode)) {
      console.log('②');
      // 新后与旧后
      patchVnode(oldEndVnode, newEndVnode);
      oldEndVnode = oldCh[--oldEndIdx];
      newEndVnode = newCh[--newEndIdx];
    } else if (sameVnode(oldStartVnode, newEndVnode)) {
      console.log('③');
      // 新后与旧前
      patchVnode(oldStartVnode, newEndVnode);
      // 移动节点位置到旧后之后
      parentElm.insertBefore(oldStartVnode.elm, oldEndVnode.elm.nextSibling)
      oldStartVnode = oldCh[++oldStartIdx];
      newEndVnode = newCh[--newEndIdx];
    } else if (sameVnode(oldEndVnode, newStartVnode)) {
      console.log('④');
      // 新前与旧后
      patchVnode(oldEndVnode, newStartVnode);
      // 移动节点位置到旧前之前
      parentElm.insertBefore(oldStartVnode.elm, oldStartVnode.elm)
      oldEndVnode = oldCh[--oldEndIdx];
      newStartVnode = newCh[++newStartIdx];
    } else {
      console.log('都没命中');
      if (!keyMap) {
        keyMap = {};
        for (let i = oldStartIdx; i <= oldEndIdx; i++) {
          const key = oldCh[i].key;
          if (key != undefined) {
            keyMap[key] = i;
          }
        }
      }
      console.log(keyMap);
      const idxInOld = keyMap[newStartVnode.key];
      if (idxInOld === undefined) {
        // 新的节点，插入新节点
        parentElm.insertBefore(createElement(newStartVnode), oldStartVnode.elm);
      } else {
        // 旧的节点，移动位置
        const elmToMove = oldCh[idxInOld];
        patchVnode(elmToMove, newStartVnode);
        // 将此项置为undefined
        oldCh[idxInOld] = undefined;
        // 移动
        parentElm.insertBefore(elmToMove.elm, oldStartVnode.elm);
      }
      newStartVnode = newCh[++newStartIdx];
    }
  }

  // 有没有剩余节点
  if (newStartIdx <= newEndIdx) {
    // new还有剩余节点未处理
    let before = newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].elm;
    for (let i = newStartIdx; i <= newEndIdx; i++) {
      parentElm.insertBefore(createElement(newCh[i]), before);
    }
  }

  if (oldStartIdx <= oldEndIdx) {
    // old还有剩余节点未处理
    for (let i = oldStartIdx; i <= oldEndIdx; i++) {
      if (oldCh[i]) {
        parentElm.removeChild(oldCh[i].elm);
      }
    }
  }
}